﻿@model IEnumerable<Wei.Model.Content_Model>
@using Wei.Model;
@{
    ViewBag.Title = "二维也";
}
<style>
    .fly-list li {
        position: relative;
        height: 45px;
        line-height: 22px;
        padding: 15px 15px 15px 75px;
        border-bottom: 1px dotted #e2e2e2;
    }

    .fly-avatar img {
        display: block;
        width: 45px;
        height: 45px;
        margin: 0;
        border-radius: 2px;
    }

    .fly-avatar {
        position: absolute;
        left: 15px;
        top: 15px;
    }

    .fly-list-info a[link] {
        color: #999;
    }

    a {
        color: #333;
        text-decoration: none;
    }

    .fly-list li h2 {
        height: 26px;
        font-size: 18px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .fly-list-info {
        position: relative;
        /*font-size: 13px;
        color: #999;*/
    }

        .fly-list-info span {
            font-size: 13px;
            color: #999;
        }

    .fly-list-nums {
        right: 0;
        top: 0;
        padding-right: 0 !important;
    }

    .website li {
        float: left;
        padding: 10px;
    }
</style>
<br />

<div class="layui-row">
    <div class="layui-col-md12">
        <div class="layui-carousel" id="guanggaowei">
            <div carousel-item>

                @*<div style="font-size: 220px;">广告位招租</div>
                    <div style="font-size: 220px;">广告位招租</div>
                    <div style="font-size: 220px;">广告位招租</div>
                    <div style="font-size: 220px;">广告位招租</div>*@
                @foreach (var item in ViewBag.img_arr as string[])
                {
                    <div><img src="../..@item" width="100%" height="400" /></div>
                }
                <div style="font-size: 220px;">广告位招租</div>
            </div>
        </div>
    </div>
</div>
<div class="layui-row layui-col-space15">
    <div class="layui-col-md9">
        <div class="layui-tab layui-tab-card" style="background:#fff;">
            <ul class="layui-tab-title">
                <li class="layui-this">最新动态</li>
                <li>轻松一下</li>
                <li>不错的网站</li>
                <li id="dont_click">千万别点！</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <ul class="fly-list" id="lazye_list">
                        @*@foreach (var item in Model)
                        {
                            <li>
                                <a href="/u/9646728" class="fly-avatar">
                                    <img src="@item.c_cover_img" alt="@item.c_title">
                                </a>
                                <h2> <a href="/Home/Content_Detail?c_id=@item.c_id">@item.c_title</a> </h2>
                                <div class="fly-list-info">
                                    来源： <a href="/u/9646728" link=""><cite>@item.c_author</cite> </a>
                                    &nbsp;&nbsp;&nbsp;&nbsp;
                                    发布时间：<span>@string.Format("{0:yyyy-MM-dd HH:mm}", item.c_create_date)</span>
                                    &nbsp;&nbsp;&nbsp;&nbsp;
                                    标签：<a class="layui-badge">@item.c_type_name</a>
                                    <div class="layui-layout-right">
                                        <span class="fly-list-nums"><i class="layui-icon" title="查看数" style="font-size: 20px; color: #1E9FFF;">&#xe705;</i>&nbsp;@item.c_read_num</span>
                                        &nbsp;&nbsp;
                                        <span class="fly-list-nums"><i class="layui-icon" title="点赞数" style="font-size: 20px; color: #1E9FFF;">&#xe6c6;</i>&nbsp;@item.have_good</span>
                                        &nbsp;&nbsp;
                                        <span class="fly-list-nums"><i class="layui-icon" title="评论数" style="font-size: 20px; color: #1E9FFF;">&#xe63a;</i>&nbsp;@item.c_good</span>
                                    </div>
                                </div>
                                <div class="fly-list-badge">
                                </div>
                            </li>
                        }*@

                    </ul>
                </div>

                <div class="layui-tab-item" style="min-height:770px;">



                    <div style="padding: 20px; background-color: #F2F2F2;">
                        <div class="layui-row layui-col-space15">
                            <div class="layui-col-md12">
                                <div class="layui-card">
                                    <br />
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">输入内容：</label>
                                        <div class="layui-input-inline" style="width: 580px;">
                                            <input type="text" style="float:left;" name="tuling_text" id="tuling_text" lay-verify="title" autocomplete="off" placeholder="请输入内容（例如：讲个笑话、看新闻、广州到拉萨的火车、明天广州到拉萨的飞机）" class="layui-input">

                                        </div>
                                        <div class="layui-inline">
                                            <button style="float:left;" type="button" onclick="tuling_chat()" class="layui-btn layui-btn-warm">发送</button>
                                        </div>
                                    </div>

                                    @*<div class="layui-card-header">响应内容</div>*@
                                    <div class="layui-card-body" id="tuling_res">
                                        跟我聊天吧
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <br />



                </div>
                <div class="layui-tab-item" style="height:770px;">
                    <ul class="website">
                        <li><a class="layui-btn layui-btn-danger layui-btn-lg" href="https://www.bejson.com/" target="_blank">JSON在线格式化</a></li>
                        <li><a class="layui-btn layui-btn-normal layui-btn-lg" href="http://www.runoob.com/" target="_blank">菜鸟教程</a></li>
                        <li><a class="layui-btn layui-btn-primary layui-btn-lg" href="http://iconfont.cn/home/index?spm=a313x.7781069.1998910419.2" target="_blank">阿里巴巴矢量图</a></li>
                        <li><a class="layui-btn layui-btn-primary layui-btn-lg" href="https://www.cnblogs.com/" target="_blank">博客园</a></li>
                    </ul>
                </div>
                <div class="layui-tab-item" style="height:770px;">
                    <div id="test2" style="font-size: 80px;"></div>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-col-md3">
        <div class="layui-tab layui-tab-card" style="background:#fff;">
            <ul class="layui-tab-title">
                <li class="layui-this">网站信息</li>
                <li>用户管理</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <ul>
                        <li>注册人数：@ViewBag.count</li>
                        <li>在线人数：@ViewBag.online</li>
                        @*<li>注册人数：29003</li>
                            <li>在线人数：10086</li>*@
                        <li>上线日期：2018-1-1</li>
                        <li>站长QQ：3491471346</li>
                        <li>站长微信：HaWei924</li>
                    </ul>
                </div>
                <div class="layui-tab-item">即将开放</div>
            </div>
        </div>
        <!--标签类别的部分页-->
        @Html.Action("Content_Type_List", "Home")

        <div class="layui-tab layui-tab-card" style="background:#fff;">
            <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;text-align:center;">
                <legend>微信鼓励一下 ^_^</legend>
            </fieldset>
            <img src="~/images/wechar.png" width="273" height="273" />
        </div>
    </div>
</div>


<script>
    var carousel = layui.carousel;
    var util = layui.util
        , laydate = layui.laydate;
    var $ = layui.jquery; //不用额外加载jQuery，flow模块本身是有依赖jQuery的，直接用即可。
    var flow = layui.flow;
    //建造实例
    carousel.render({
        elem: '#guanggaowei'
        , width: '100%' //设置容器宽度
        , arrow: 'always' //始终显示箭头
        //,anim: 'updown' //切换动画方式
    });

    //倒计时
    var thisTimer, setCountdown = function (y, M, d, H, m, s) {
        var endTime = new Date(y, M || 0, d || 1, H || 0, m || 0, s || 0) //结束日期
            , serverTime = new Date(); //假设为当前服务器时间，这里采用的是本地时间，实际使用一般是取服务端的

        clearTimeout(thisTimer);
        util.countdown(endTime, serverTime, function (date, serverTime, timer) {
            var str = date[0] + '天' + date[1] + '时' + date[2] + '分' + date[3] + '秒';
            lay('#test2').html("本站距百年老站还有：" + str);
            thisTimer = timer;
        });
    };
    setCountdown(2118, 1, 1);

    //定义一个函数，实现随机生成十六进制颜色值

    function getColor() {
        //定义字符串变量colorValue存放可以构成十六进制颜色值的值
        var colorValue = "0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f";
        //以","为分隔符，将colorValue字符串分割为字符数组["0","1",...,"f"]
        var colorArray = colorValue.split(",");
        var color = "#";//定义一个存放十六进制颜色值的字符串变量，先将#存放进去
        //使用for循环语句生成剩余的六位十六进制值
        for (var i = 0; i < 6; i++) {
            //colorArray[Math.floor(Math.random()*16)]随机取出
            // 由16个元素组成的colorArray的某一个值，然后将其加在color中，
            //字符串相加后，得出的仍是字符串
            color += colorArray[Math.floor(Math.random() * 16)];
        }
        document.getElementById("test2").style.color = color;
        return color;
    }

    //测试函数
    //setTimeout('getColor()', 100);
    countSecond();
    function countSecond() {
        getColor();
        setTimeout("countSecond()", 100);
    }
    //扩展Date格式化
    Date.prototype.Format = function (fmt) { //author: meizz
        var o = {
            "M+": this.getMonth() + 1, //月份
            "d+": this.getDate(), //日
            "h+": this.getHours(), //小时
            "m+": this.getMinutes(), //分
            "s+": this.getSeconds(), //秒
            "q+": Math.floor((this.getMonth() + 3) / 3), //季度
            "S": this.getMilliseconds() //毫秒
        };
        if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
        for (var k in o)
            if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
        return fmt;
    }

    flow.load({
        elem: '#lazye_list' //指定列表容器
        , isAuto: true
        , done: function (page, next) { //到达临界点（默认滚动触发），触发下一页
            var lis = [];
            //以jQuery的Ajax请求为例，请求下一页数据（注意：page是从2开始返回）
            $.get('/Home/ContentList_Json?pageIndex=' + page, function (res) {
                //假设你的列表返回在data集合中
                layui.each(res.data, function (index, item) {
                    var a = eval('new ' + (item.c_create_date.replace(/\//g, '')));

                    var html = '';
                    html += '<li>';
                    html += '<a href="/u/9646728" class="fly-avatar">';
                    html += '<img src="' + item.c_cover_img + '" alt="' + item.c_title + '">';
                    html += '</a>';
                    html += '<h2><a href="/Home/Content_Detail?c_id=' + item.c_id + '">' + item.c_title + '</a></h2>';
                    html += '<div class="fly-list-info">';
                    html += '来源：<a href="/u/9646728" link=""><cite>' + item.c_author + '</cite></a>';
                    html += '&nbsp;&nbsp;&nbsp;&nbsp;';
                    html += '发布时间：<span>' + a.Format("yyyy-MM-dd hh:mm:ss"); + '</span>';
                    html += '&nbsp;&nbsp;&nbsp;&nbsp;';
                    html += '标签：<a class="layui-badge">' + item.c_type_name + '</a>';
                    html += '<div class="layui-layout-right">';
                    html += '<span class="fly-list-nums"><i class="layui-icon" title="查看数" style="font-size: 20px; color: #1E9FFF;">&#xe705;</i>&nbsp;' + item.c_read_num + '</span>';
                    html += '&nbsp;&nbsp;';
                    html += '<span class="fly-list-nums"><i class="layui-icon" title="点赞数" style="font-size: 20px; color: #1E9FFF;">&#xe6c6;</i>&nbsp;' + item.have_good + '</span>';
                    html += '&nbsp;&nbsp;';
                    html += '<span class="fly-list-nums"><i class="layui-icon" title="评论数" style="font-size: 20px; color: #1E9FFF;">&#xe63a;</i>&nbsp;' + item.c_good + '</span>';
                    html += '</div>';
                    html += '</div>';
                    html += '<div class="fly-list-badge">';
                    html += '</div>';
                    html += '</li>';
                    lis.push(html);
                });
                //执行下一页渲染，第二参数为：满足“加载更多”的条件，即后面仍有分页
                //pages为Ajax返回的总页数，只有当前页小于总页数的情况下，才会继续出现加载更多
                next(lis.join(''), page < res.count);
            });
        }
    });


    





    //图灵聊天
    function tuling_chat() {
        //加载层-风格4
        layer.load(1);
        $.get('/Home/tuling_chat', { text: $('#tuling_text').val() }, function (data) {
            //var res = eval('(' + data + ')');
            var res = JSON.parse(data);
            //code	消息类型
            //100000	文本类
            //200000	链接类
            //302000	新闻类
            //308000	菜谱类
            //313000	儿歌类
            //314000	诗词类


            //code	异常信息
            //40001	参数key错误
            //40002	请求内容info为空
            //40004	当天请求次数已使用完
            //40007	数据格式异常
            layer.closeAll();
            if (res.code == 40001) {
                $('#tuling_res').html("参数key错误，请稍后再试");
            } else if (res.code == 40002) {
                $('#tuling_res').html("请求内容info为空，请稍后再试");
            } else if (res.code == 40004) {
                $('#tuling_res').html("Sorry....聊天次数已使用完，请明天再来 -_- ");
            } else if (res.code == 40007) {
                $('#tuling_res').html("数据格式异常，请稍后再试");
            } else if (res.code == 100000) {
                $('#tuling_res').html(res.text);
            } else if (res.code == 200000) {
                var url = '<a href="' + res.url + '" target="_blank">查看详情</a>';
                $('#tuling_res').html(res.text + "<br/><br/>" + url);
            } else if (res.code == 302000) {
                var list = res.list;
                var html = '';
                html += '<ul class="layui-timeline">';
                for (var i = 0; i < list.length; i++) {
                    html += '<li class="layui-timeline-item">';
                    html += '<i class="layui-icon layui-timeline-axis"></i>';
                    html += '<div class="layui-timeline-content layui-text">';
                    html += '<h2 class="layui-timeline-title"><a href="' + list[i].detailurl + '" target="_blank">"' + list[i].article + '"</a></h2>';
                    html += '<p>';
                    html += '<br/>来源：' + list[i].source + "<br/><br/>";
                    html += '<img src="' + list[i].icon + '"/>';
                    html += '</p>';
                    html += '</div>';
                    html += '</li>';
                }
                html += '</ul>';
                $('#tuling_res').html(res.text + "<br/><br/>" + html);
            } else if (res.code == 308000) {
                var list = res.list;
                var html = '';
                html += '<ul class="layui-timeline">';
                for (var i = 0; i < list.length; i++) {
                    html += '<li class="layui-timeline-item">';
                    html += '<i class="layui-icon layui-timeline-axis"></i>';
                    html += '<div class="layui-timeline-content layui-text">';
                    html += '<h2 class="layui-timeline-title"><a href="' + list[i].detailurl + '" target="_blank">"' + list[i].name + '"</a></h2>';
                    html += '<p>';
                    html += list[i].info;
                    html += '</p>';
                    html += '</div>';
                    html += '</li>';
                }
                html += '</ul>';
                $('#tuling_res').html(res.text + "<br/><br/>" + html);
            } else if (res.code == 313000) {
                //$('#tuling_res').html(res.text + "<br/>" + html);
            } else if (res.code == 314000) {

            }
        });
    }


</script>
